import React, { useEffect, useState } from "react";
import TopNav from "../../components/TopNav/TopNav";
import Workload from "./workload";
import axios from "axios";
import Medical from "./medical";
import Recentevents from "./recentevents";
import ProjectLog from "./ProjectLog";
import "./dashboard.css";
import { useNavigate } from "react-router";
import DataNav from "../../components/dataNav/dataNav";

const MemberDashboard = () => {
  const [staffList, setStaffList] = useState([]);
  const navigate = useNavigate();
  const init = async () => {
    const res = await axios.get("http://192.168.0.154:3000/my/posts");
    setStaffList(res.data);
  };
  useEffect(() => {
    init();
  }, []);

  useEffect(() => {
    // 检查registerStep1并进行相应跳转
    const teamMembers = localStorage.getItem("teamMembers");
    if (teamMembers) {
      navigate("/member-dashboard");
    } else {
      navigate("/login");
    }
  }, [navigate]);
  return (
    <div className="dashboard-container">
      <TopNav />
      <div style={{ padding: "20px" }}>
        <h1 style={{ fontSize: "24px", marginBottom: "16px" }}>仪表盘</h1>
        <div
          style={{
            backgroundColor: "#f5f5f5",
            padding: "12px",
            borderRadius: "10px",
            display: "flex",
            alignItems: "center",
            gap: "8px",
            fontSize: "14px",
          }}
        >
          {/* <span>📅</span>
          <span>2021年11月16日-2021年12月16日</span> */}
          <DataNav />
        </div>
        <Workload staffList={staffList} />
        <div
          style={{
            display: "flex",
            justifyContent: "space-between",
            alignItems: "center",
            marginBottom: "16px",
            paddingInline: "20px",
            marginTop: "10px",
          }}
        >
          <h2 style={{ fontSize: "18px" }}>项目</h2>
          <a
            href="/project"
            style={{
              color: "#1890ff",
              textDecoration: "none",
              fontSize: "14px",
            }}
          >
            查看全部 &gt;
          </a>
        </div>
        <Medical />
        {/* <Food /> */}
        {/* 标题栏 */}
        <div
          style={{
            display: "flex",
            justifyContent: "space-between",
            alignItems: "center",
            marginBottom: "16px",
            marginTop: "20px",
          }}
        >
          <h3
            style={{
              fontSize: "16px",
              margin: 0,
              fontWeight: "500",
            }}
          >
            最近事件
          </h3>
          <a
            href="/membereventclick"
            style={{
              color: "#1890ff",
              textDecoration: "none",
              fontSize: "14px",
            }}
          >
            查看全部 &gt;
          </a>
        </div>
        <Recentevents />
        <div style={{ backgroundColor: "#fff", marginTop: "20px" }}>
          <ProjectLog logs={staffList} />
        </div>
      </div>
      <span className="add-button">+</span>
    </div>
  );
};

export default MemberDashboard;
